﻿@model List<FTBS.Models.Entities.Film>

@foreach (var film in Model)
{
    <div style="display: block; margin: 0 auto;">
         <!-- Phim đầu tiên -->
        <div style="float: left;">
            <div class="tile quadro block" style="margin-left: 15px; border: solid; border-width: 1px">
                <div class="tile-content image">
                    <img src="~/Image/FilmImage/@Model[0].ImageURL" style="height: 360px; width: 260px" />
                </div>

                <div style="margin-left: 7px; margin-top: 122%">
                    <button class="inverse" style="width: 120px">Mua vé ngay</button>
                    <button class="inverse" style="width: 120px">Xem lịch chiếu</button>
                </div>
            </div>
            <div>
                <h3 style="color: black; margin-left: 12px">Phim: @Model[0].Name</h3>
                <h3 style="color: black; margin-left: 12px; font-size: 17px">Khuyến mãi: </h3>
            </div>
        </div>

        <!-- 6 phim còn lại -->
        <div style="float: left;">
            <div style="float: left; height: 50px; width: 50px; margin: 150px; margin-left: 50px; margin-top: 0px">
                <div class="tile double">
                    <div class="tile-content image">
                        <img src="~/Image/FilmImage/Qua_Tim_Mau.jpg" style="height: 200px; width: 159px" />
                    </div>
                    <div>
                        <button class="small warning" style="margin-left: 1.25px; margin-top: 165px">Lịch chiếu</button>
                        <button class="small warning" style="width: 76px; margin-top: 165px">Mua vé   </button>
                    </div>
                </div>
            </div>
            <div style="float: left; height: 50px; width: 50px; margin: 150px; margin-left: 20px; margin-top: 0px">
                <div class="tile double">
                    <div class="tile-content image">
                        <img src="~/Image/FilmImage/Lua_Phat.jpg" style="height: 200px; width: 159px" />
                    </div>
                    <div>
                        <button class="small warning" style="margin-left: 1.25px; margin-top: 165px">Lịch chiếu</button>
                        <button class="small warning" style="width: 76px; margin-top: 165px">Mua vé   </button>
                    </div>
                </div>
            </div>
            <div style="float: left; height: 50px; width: 50px; margin: 150px; margin-left: 20px; margin-top: 0px">
                <div class="tile double">
                    <div class="tile-content image">
                        <img src="~/Image/FilmImage/Vertical/MR PEABODY AND SHERMAN.jpg" style="height: 200px; width: 159px" />
                    </div>
                    <div>
                        <button class="small warning" style="margin-left: 1.25px; margin-top: 165px">Lịch chiếu</button>
                        <button class="small warning" style="width: 76px; margin-top: 165px">Mua vé   </button>
                    </div>
                </div>
            </div>

            @*Thông tin khuyến mãi dòng 1*@
            <div style="display: block">
                <div style="margin-left: 48px; float: left">
                    <strong>Phim: Quả Tim Máu</strong><br />
                    <strong>Giảm 15% cho thành viên VIP</strong>
                </div>
                <div style="margin-left: 26px; float: left">
                    <strong>Phim: Lửa Phật</strong><br />
                    <strong>Giảm 10% cho ghế Couple</strong>
                </div>
                <div style="margin-left: 45px; float: left">
                    <strong>Phim: Mr Peabody</strong><br />
                    <strong>Giảm 10% cho ghế Couple</strong>
                </div>
            </div>

            <div style="float: left; height: 50px; width: 50px; margin: 150px; margin-left: 50px; margin-top: 20px">
                <div class="tile double">
                    <div class="tile-content image">
                        <img src="~/Image/FilmImage/Vertical/Non_Stop_Vertical.jpg" style="height: 200px; width: 159px" />
                    </div>
                    <div>
                        <button class="small warning" style="margin-left: 1.25px; margin-top: 165px">Lịch chiếu</button>
                        <button class="small warning" style="width: 76px; margin-top: 165px">Mua vé   </button>
                    </div>
                </div>
            </div>
            <div style="float: left; height: 50px; width: 50px; margin: 150px; margin-left: 20px; margin-top: 20px">
                <div class="tile double">
                    <div class="tile-content image">
                        <img src="~/Image/FilmImage/Vertical/RoboCop.jpg" style="height: 200px; width: 159px" />
                    </div>
                    <div>
                        <button class="small warning" style="margin-left: 1.25px; margin-top: 165px">Lịch chiếu</button>
                        <button class="small warning" style="width: 76px; margin-top: 165px">Mua vé   </button>
                    </div>
                </div>
            </div>
            <div style="float: left; height: 50px; width: 50px; margin: 150px; margin-left: 20px; margin-top: 20px">
                <div class="tile double">
                    <div class="tile-content image">
                        <img src="~/Image/FilmImage/Vertical/Winters Tale.jpg" style="height: 200px; width: 159px" />
                    </div>
                    <div>
                        <button class="small warning" style="margin-left: 1.25px; margin-top: 165px">Lịch chiếu</button>
                        <button class="small warning" style="width: 76px; margin-top: 165px">Mua vé   </button>
                    </div>
                </div>
            </div>

            @*Thông tin khuyến mãi dòng 2*@
            <div style="display: block">
                <div style="margin-left: 48px; float: left">
                    <strong>Phim: Non Stop</strong><br />
                    <strong>Giảm 15% cho thành viên VIP</strong>
                </div>
                <div style="margin-left: 26px; float: left">
                    <strong>Phim: RoboCop</strong><br />
                    <strong>Giảm 15% cho thành viên VIP</strong>
                </div>
                <div style="margin-left: 26px; float: left">
                    <strong>Phim: Winter's Tale</strong><br />
                    <strong>Giảm 15% cho thành viên VIP</strong>
                </div>
            </div>
        </div>
    </div>
}
